import * as React from "react";
import { createRoot } from "react-dom/client";
import {
  createBrowserRouter,
  RouterProvider,
  Navigate,
} from "react-router-dom";

// import components
import Root, {
  action as rootAction,
  loader as rootLoader,
} from "./pages/root/Root.jsx";
import ContentPresentation from "./pages/contentPresentation/ContentPresentation.jsx";
import LegalDocumentsMain, {
  loader as LegalDocumentLoader,
  action as LegalDocumentAction
} from "./pages/legalDocumentsHub/LegalDocumentsMain.jsx";
import Login, { action as loginAction } from "./pages/loginRegister/Login.jsx";
import Register, {
  action as registerAction,
} from "./pages/loginRegister/Register.jsx";
import RequireAuth from "./components/common/RequireAuth.jsx";
import Portal from "./pages/portal/Portal.jsx";
// import Test from "./pages/testPage/Test.jsx";
import Error from "./pages/error/Error.jsx";

/**
 * react router
 */
const router = createBrowserRouter([
  {
    path: "/",
    element: <Root />,
    action: rootAction,
    loader: rootLoader,
    children: [
      {
        index: true,
        element: <Navigate to={"fayucz"} />,
      },
      {
        path: "fayucz",
        element: <Portal />,
      },
      {
        path: "fayucz/legislation",
        element: <LegalDocumentsMain tab="legislation" />,
        action: LegalDocumentAction,
        loader: LegalDocumentLoader,
      },
      {
        path: "fayucz/judgment",
        element: <LegalDocumentsMain tab="judgment" />,
      },
      {
        path: "/fayvcz/contract-templates",
        element: <LegalDocumentsMain tab="contract" />,
      },
      {
        path: "legal-instruments/:id",
        element: (
          <RequireAuth>
            <ContentPresentation />
          </RequireAuth>
        ),
      },
    ],
  },
  {
    path: "/login",
    element: <Login />,
    action: loginAction,
  },
  {
    path: "/register",
    element: <Register />,
    action: registerAction,
  },
  {
    path: "/*",
    element: <Error />,
  },
]);

/**
 * 将组件渲染到 lily DOM节点
 */
const lily = createRoot(document.getElementById("lily"));

lily.render(
  <React.StrictMode>
    <RouterProvider router={router} />
  </React.StrictMode>
);
